import {
  request
} from "../../request/index.js";
import regeneratorRuntime from '../../lib/runtime/runtime';
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 左侧菜单数据
    leftMenuList: [],
    // 右侧商品数据
    rightContent: [],
    // 被点击的左侧菜单
    currentIndex: 0,
    // 右侧内容滚动条距离顶部距离
    scrollTop: 0

  },
  // 接口的返回数据
  Cates: [],

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    /*
          web中的本地存储和小程序区别
         1 方式不一样
          web:储存 localStorage.setItem("key","value")  localStorage.getItem("key")获取
          小程序中：储存 wx.setStorageSync("key", "value");  wx.getStorageSync("key");获取
          2 存的时候 有没有做类型转换
            web：不管什么类型数据都会先调用一下 toString（），把数据变成字符串在存入进去
            小程序： 不存在类型转换 存什么类型获取的时候就是什么类型
    */
    // 1 先判断本地存储中有没有旧的数据{time:Data.now(),data:[...]}
    // 2 没有直接发送请求
    // 3 有而且没过期 直接用本地旧数据

    // 1 获取本地存储中的数据 小程序中也存在本地存储
    const Cates = wx.getStorageSync("cates");
    // 2 判断
    if (!Cates) {
      //  不存在 发送请求获取数据
      this.getCates();
    } else {
      //  有旧的数据 自定义过期时间  10s
      if (Date.now() - Cates.time > 1000 * 10) {
        // 重新弄发送请求
        this.getCates();
      } else {
        // 可以使用旧的数据
        this.Cates = Cates.data;
        let leftMenuList = this.Cates.map(v => v.cat_name);
        let rightContent = this.Cates[0].children;

        this.setData({
          leftMenuList,
          rightContent
        })
      }
    }
  },
  // 获取分类数据
  async getCates() {
    // request({
    //     url: "/categories"
    //   })
    //   .then(res => {
    //     // console.log(res);
    //     this.Cates = res.data.message;
    //     // 把接口的数据存入到本地存储
    //     wx.setStorageSync("cates", {
    //       time: Date.now(),
    //       data: this.Cates
    //     });

    //     // 构造左侧下滑栏数据
    //     let leftMenuList = this.Cates.map(v => v.cat_name);
    //     // 右侧商品数据
    //     let rightContent = this.Cates[0].children;

    //     this.setData({
    //       leftMenuList,
    //       rightContent
    //     })
    //   })

    // 1使用es7 async await来发送请求
    const res = await request({
      url: "/categories"
    });
    // this.Cates = res.data.message;
    this.Cates = res;
    // 把接口的数据存入到本地存储
    wx.setStorageSync("cates", {
      time: Date.now(),
      data: this.Cates
    });
    // 构造左侧下滑栏数据
    let leftMenuList = this.Cates.map(v => v.cat_name);
    // 右侧商品数据
    let rightContent = this.Cates[0].children;
    this.setData({
      leftMenuList,
      rightContent
    })
  },
  // 左侧菜单点击事件
  handleItemTap(e) {
    // 1 获取被点击的标题身上的索引
    // 2 给data中的currentIndex赋值
    // 3 根据不同的索引渲染不同的内容
    const {
      index
    } = e.currentTarget.dataset;

    let rightContent = this.Cates[index].children

    this.setData({
      currentIndex: index,
      rightContent,
      // 重新设置右侧内容的scroll-view标签距离顶部的距离
      scrollTop: 0
    })
    // console.log(e);
  }
})